<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<meta charset="utf-8">
<head th:include="include :: header">
    <script src="../../../static/ruoyi/js/ry-ui.js"></script>
</head>
<link th:href="@{/ajax/libs/iCheck/custom.css}" rel="stylesheet"/>
<link href="/ajax/libs/jquery-layout/jquery.layout-latest.css"
      th:href="@{/ajax/libs/jquery-layout/jquery.layout-latest.css}" rel="stylesheet"/>
<link href="/ajax/libs/jquery-ztree/3.5/css/metro/zTreeStyle.css"
      th:href="@{/ajax/libs/jquery-ztree/3.5/css/metro/zTreeStyle.css}" rel="stylesheet"/>
<body class="gray-bg">
<div class="ui-layout-west">
    <div class="main-content">
        <div class="box box-main">
            <div class="box-header">
                <div class="box-title">
                    <i class="fa icon-grid"></i> 组织机构
                </div>
                <div class="box-tools pull-right">
                    <a type="button" class="btn btn-box-tool menuItem" href="/dept/listPage" target="iframe0"
                       title="管理机构"><i
                            class="fa fa-edit"></i></a>
                    <button type="button" class="btn btn-box-tool" id="btnRefresh" title="刷新机构"><i
                            class="fa fa-refresh"></i></button>
                </div>
            </div>
            <div class="ui-layout-content">
                <div id="tree" class="ztree"></div>
            </div>
        </div>
    </div>
</div>

<div class="container-div ui-layout-center">
    <div class="row">
        <div class="col-sm-12 select-info">
            <form id="operlog-form">
                <div class="select-list gd">
                    <ul>
                        <li>
                            登录ID：<input type="text" name="uid"/>
                        </li>
                        <li>
                            姓名：<input type="text" name="name"/>
                        </li>
                        <li>
                            手机号码：<input type="text" name="tel"/>
                        </li>

                        <li>
                            用户状态：<select name="status"
                        >
                            <option value="">所有</option>
                            <option th:value="0">正常</option>
                            <option th:value="1">停用</option>
                        </select>
                        </li>
                        <li class="select-time">
                            <label>创建时间： </label>
                            <input type="text" class="time-input" style="width: 150px" id="beginTime" placeholder="开始时间" name="beginTime" lay-key="1">
                            <span>-</span>
                            <input type="text" class="time-input" style="width: 150px" id="overTime" placeholder="结束时间" name="overTime" lay-key="2">
                        </li>
                        <li>
                            <a class="btn btn-primary btn-rounded btn-sm"
                               onclick="$.table.search($('form').attr('id'))"><i class="fa fa-search"></i>&nbsp;搜索</a>

                            <a class="btn btn-warning btn-rounded btn-sm"
                               onclick="$.form.reset($('form').attr('id'))"><i class="fa fa-refresh"></i>&nbsp;重置</a>
                        </li>
                    </ul>
                </div>
            </form>
        </div>

        <div class="col-sm-12 select-info order-table">
            <div class="btn-group hidden-xs btnGroup" id="toolbar" role="group">
                <a class="btn btn-outline btn-success btn-rounded" onclick="$.operate.addFull()"
                   shiro:hasPermission="user:add">
                    <i class="fa fa-plus"></i> 新增
                </a>
                <a class="btn btn-outline btn-danger btn-rounded" onclick="$.operate.batRemove()"
                   shiro:hasPermission="user:del">
                    <i class="fa fa-trash-o"></i> 删除
                </a>
                <a class="btn btn-info" onclick="$.table.importExcel()"
                   shiro:hasPermission="user:import">
                    <i class="fa fa-upload"></i> 导入
                </a>
                <a class="btn btn-warning" onclick="$.table.exportExcel()"
                   shiro:hasPermission="user:export">
                    <i class="fa fa-download"></i> 导出
                </a>
            </div>
            <table id="bootstrap-table" data-mobile-responsive="true"></table>
        </div>
    </div>
</div>
<div th:include="include :: footer"></div>
<script th:src="@{/ajax/libs/jquery-layout/jquery.layout-latest.js}"></script>
<script th:src="@{/ajax/libs/jquery-ztree/3.5/js/jquery.ztree.all-3.5.js}"></script>
<script th:inline="javascript">
    var updateFlag = [[${@permission.hasPermi('user:update')}]];
    var delFlag = [[${@permission.hasPermi('user:del')}]];
    $(document).ready(function () {

        //layuout布局
        var myLayout = $("body").layout({applyDemoStyles: false});
        myLayout.sizePane("west", 180);

        btn.queryUserList();
        btn.treeDept();

        $("#btnRefresh").click(function () {
            btn.RefreshTree();
        });
    });

    var btn = {

        RefreshTree: function () {
            btn.treeDept();
        },
        treeDept: function () {
            var zTreeObj,
                setting = {
                    view: {
                        selectedMulti: false
                    },
                    callback: {
                        onClick: btn.zTreeOnClick
                    }

                },
                zTreeNodes = [
                    {
                        "name": "部门管理", open: true, children: initDeptData()
                    }
                ];

            function initDeptData() {
                var arr = new Array();
                $.ajaxSettings.async = false;
                $.post("/dept/ajaxlist", {}, function (data) {
                    for (var i = 0; i < data.length; i++) {
                        var treeData = {
                            "name": data[i].deptName,
                            "value": data[i].depId

                        }
                        arr.push(treeData);
                    }
                })
                return arr;
            }


            zTreeObj = $.fn.zTree.init($("#tree"), setting, zTreeNodes);
        },
        queryUserList: function () {
            var options = {
                url: "/user/tableList",
                createUrl: "/user/toAdd",
                updateUrl: "/user/edit/{id}",
                removeUrl: "/user/del",
                exportUrl: "/user/export",
                importUrl: "/user/importData",
                importTemplateUrl: "/user/importTemplate",
                sortName: "createTime",
                sortOrder: "desc",
                modalName: "用户",
                search: false,
                showExport: true,
                columns: [{
                    checkbox: true
                },
                    {
                        field: 'uid',
                        title: '用户ID',
                        sortable: true
                    },

                    {
                        field: 'name',
                        title: '姓名'
                    },
                    {
                        field:'loginName',
                        title:'登录名'
                    },
                    {
                        field: 'email',
                        title: '邮箱'
                    },
                    {
                        field: 'tel',
                        title: '手机'
                    },
                    {
                        field: 'status',
                        title: '状态',
                        align: 'center',
                        formatter: function (value, row, index) {
                            if (value == 0) {
                                return '<span class="badge badge-primary">正常</span>';
                            } else {
                                return '<span class="badge badge-danger">停用</span>';
                            }
                        }
                    },
//                    {
//                        field: 'createTime',
//                        title: '创建时间',
//                        formatter: function (value, row, index) {
//                            return $.common.dateFormat(value)
//                        }
//                    },
                    {
                        title: '操作',
                        align: 'center',
                        formatter: function (value, row, index) {
                            //alert(JSON.stringify(row));
                            var actions = [];
                            actions.push('<a  class="btn btn-success btn-xs '+updateFlag+'" href="#" onclick="$.operate.editFull(\'' + row.uid + '\')"><i class="fa fa-edit"></i>编辑</a> ');
                            actions.push('<a class="btn btn-danger btn-xs '+delFlag+'" href="#" onclick="$.operate.remove(\'' + row.uid + '\')"><i class="fa fa-remove"></i>删除</a> ');
                            actions.push('<a class="btn btn-info btn-xs '+delFlag+'" href="#" onclick="resetPwd(\'' + row.uid + '\')"><i class="fa fa-key"></i>重置</a>');
                            return actions.join('');
                        }
                    }]
            };
            $.table.init(options);
        },
        zTreeOnClick: function (event, treeId, treeNode) {
            $.table.clickTree("dept", treeNode.value);
        }
    }

    /*用户管理-重置密码*/
    function resetPwd(userId) {
        var url =  '/user/resetPwd/' + userId;
        $.modal.open("重置密码", url, '800', '300');
    }

    function formatDate(times) {
        var date = new Date(times)
        var y = date.getFullYear()
        var m = date.getMonth() + 1
        m = m < 10 ? ('0' + m) : m
        var d = date.getDate()
        d = d < 10 ? ('0' + d) : d
        var h = date.getHours()
        h = h < 10 ? ('0' + h) : h
        var minute = date.getMinutes()
        minute = minute < 10 ? ('0' + minute) : minute
        return y + '-' + m + '-' + d + ' ' + h + ':' + minute
    }

</script>
</body>
<form id="importForm" enctype="multipart/form-data" class="mt20 mb10" style="display: none;">
    <div class="col-xs-offset-1">
        <input type="file" id="file" name="file"/>
        <div class="mt10 pt5">
            <input type="checkbox" id="updateSupport" name="updateSupport" title="如果登录账户已经存在，更新这条数据。"> 是否更新已经存在的用户数据
            &nbsp;	<a onclick="$.table.importTemplate()" class="btn btn-default btn-xs"><i class="fa fa-file-excel-o"></i> 下载模板</a>
        </div>
        <font color="red" class="pull-left mt10">
            提示：仅允许导入“xls”或“xlsx”格式文件！
        </font>
    </div>
</form>

</html>